<template>
  <div
    class="CommonButton"
    :class="{ disabled }"
    hover-class="hover"
    hover-start-time="0"
    hover-stay-time="0"
  >
    <slot/>
  </div>
</template>

<script>
export default {
  props: {
    disabled: {
      type: Boolean,
    },
  },

}
</script>

<style lang="scss" scoped> @import "~css/var.scss";

	.CommonButton {
		border-radius: 5px;
		line-height: 46px;
		text-align: center;
		font-weight: 500;
		font-size: $fz-xl;
		color: #fff;
		background: #d1272f;

		&.hover {
			opacity: .8;
		}

		&.disabled {
			background: #aaa;

			&.hover {
				opacity: 1;
			}
		}
	}
</style>
